 /* 顶部通栏的css */

 #shortcut {
     height: 30px;
     line-height: 30px;
     background-color: #f1f1f1;
     border-bottom: 1px solid #ccc;
 }

 #shortcut li {
     float: left;
 }

 #shortcut ul.fl .register {
     margin-left: 5px;
 }

 #shortcut .spacer {
     width: 1px;
     height: 12px;
     background-color: #666;
     margin: 8px 13px;
 }

 #shortcut ul.fr .icon-jiantou {
     position: absolute;
     top: 0px;
     right: -3px;
 }

 .website, .custom, .follow, .myshop {
     position: relative;
     padding-right: 13px;
 }

 /* 头部区域，logo，搜索框 我的购物车 */

 #header {
     overflow: hidden;
     position: relative;
     height: 150px;
     border-bottom: 2px solid #b1191a;
 }

 #header .logo {
     position: absolute;
     width: 172px;
     height: 61px;
     left: 0;
     top: 24px;
     text-indent: -9999px;
     /* font-size: 0 */
 }

 #header .logo a {
     display: block;
     width: 171px;
     height: 61px;
     background: url(../images/logo.png) no-repeat;
     background-size: cover;
 }

 .search {
     position: absolute;
     top: 25px;
     left: 344px;
     width: 538px;
     height: 57px;
     /* background-color: pink; */
 }

 .search .form {
     width: 534px;
     height: 32px;
     margin-bottom: 8px;
 }

 .search .search_txt {
     position: relative;
     width: 100%;
     height: 32px;
     text-indent: 10px;
     border: 2px solid #b1191a;
 }

 .search .form .btn {
     position: absolute;
     right: 2px;
     top: 2px;
     width: 80px;
     height: 33px;
     line-height: 33px;
     font-size: 16px;
     color: #fff;
     background-color: #b1191a;
 }

 .search .hotword {
     margin-left: 12px;
     color: #c81623;
 }

 .search .hotword li {
     float: left;
     margin-right: 23px;
 }

 /* 我的购物车 */

 .cart {
     position: absolute;
     right: 64px;
     top: 25px;
     width: 140px;
     height: 36px;
     line-height: 36px;
     text-align: center;
     background-color: #f7f7f7;
     border: 1px solid #dfdfdf;
 }

 .cart .mycart {
     margin: 0 5px;
 }

 .cart .icon-gouwuche {
     vertical-align: -5%;
     color: #d84a4a;
 }

 .cart .icon-youjiantoubeifen3 {
     vertical-align: -5%;
 }

 /*1， 购物车数量，数量是不清楚多少的，所以不要给宽度，用padding撑开，
 2，内容要往右撑开，那么定位要用距离左边left的
 3，绝对定位还是会继承父元素的行高的，所以行高要当前元素的高度相等。*/

 /* 4.border-radius:左上，右上，右下，左下 */

 .cart .count {
     position: absolute;
     top: -12px;
     left: 96px;
     border-radius: 7px 7px 7px 0;
     height: 14px;
     line-height: 14px;
     padding: 3px 5px;
     color: #fff;
     background-color: #c81623;
 }

 /* 头部---全部商品 */

 .navitems {
     height: 45px;
     line-height: 45px;
     margin-top: 105px;
     /* background-color: pink; */
     font-size: 16px;
 }

 .navitems .allgood {
     width: 209px;
     text-align: center;
     color: #fff;
     height: 45px;
     background-color: #b1191a;
 }

 .navitems .item {
     margin-left: 40px;
     color: #333;
 }

 .navitems .item li {
     float: left;
     margin-right: 50px;
 }

 .navitems .item li:last-child {
     font-size: 14px;
 }

 /* 底部通栏区域 */
 #footer {
    width: 100%;
    background-color: #f5f5f5;
}

.footer .feature {

    height: 109px;
    /* line-height: 109px; */
    padding: 30px 0 0 41px;
    margin-bottom: 21px;
    border-bottom: 1px solid #ededed;
}

.footer .feature ul {
    overflow: hidden;
    /* margin-top: 30px; */
}

.footer .feature li {

    float: left;
    width: 170px;
    height: 50px;
    margin-right: 72px;
    text-align: left;
    font-size: 12px;
    color: #666;

    /* background-color: pink; */
}

.footer .feature li:last-child {
    margin-right: 0
}

.feature .bgimg {
    width: 50px;
    height: 50px;
    background: url(../images/icons.png) no-repeat -252px -3px;
    z-index: 999;
}

.feature .logistics {
    background-position: -255px -54px;
}

.feature .custom {
    background-position: -255px -105px;
}

.feature .private {
    background-position: -257px -157px;
}

.feature .help {
    background-position: -256px -208px;
}

.footer .feature li p {
    font-size: 14px;
    font-weight: bold;
    color: #333;
}

.footer .feature li a>div:nth-child(2) {
    margin: 7px 0 0 5px;
}

/* 底部第二部分 */
.footer .modules {
    padding: 0 0 20px 56px;
    border-bottom: 1px solid #ededed;
}

.footer .modules_ul>li {
    float: left;
    margin-right: 128px;
    font-size: 12px;

}

.footer .modules_ul>li:last-child {
    text-align: center;
    margin-right: 0;
}

.modules_ul>li ul {
    line-height: 21px;
    font-size: 12px;
    color: #666;

}

.modules_ul>li ul li:first-child {
    font-size: 16px;
    margin-bottom: 12px;
    color: #333;
}

.footer .about {
    padding-top: 21px;
    font-size: 12px;
    text-align: center;
    color: #666;
}
.footer .about p:nth-child(2) span{
    text-align: left;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    width: 228px;
    vertical-align: middle;
}
.footer .about p:nth-child(2) span>i{
    display: inline-block;
    height: 20px;
    width: 50px;
    overflow: hidden;
    background-image: linear-gradient(to right, #f1503b, #7e211a);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: aboutwidth 5s steps(19) infinite;
}
@keyframes aboutwidth{
    0%{
        width:12px;
    }
    100%{
       width: 240px;
    }
}
.footer .about .spacer{
    margin:0 8px;
}

